{extend name="app/shop/view/base.html"/}
{block name="resources"}
<link rel="stylesheet" href="SHOP_CSS/goods_lists.css">
<style>
	.layui-table-view {margin-top: 15px;}
	.layui-table-header {overflow: inherit;}
	.layui-table-cell {overflow: inherit}
	.ns-prompt .iconfont {font-size: 16px; font-weight: 500; color: rgba(0,0,0,0.7); margin-left: 3px; cursor: pointer;}
</style>
{/block}
{block name="main"}
<!-- 筛选面板 -->
<div class="ns-screen layui-collapse" lay-filter="selection_panel">
	<div class="layui-colla-item">
		<h2 class="layui-colla-title"></h2>
		<form class="layui-colla-content layui-form layui-show">
			<div class="layui-form-item">
				<div class="layui-inline">
					<label class="layui-form-label">商品名称：</label>
					<div class="layui-input-inline">
						<input type="text" name="search_text" placeholder="请输入商品名称" autocomplete="off" class="layui-input">
					</div>
				</div>
				<div class="layui-inline">
					<label class="layui-form-label">店内分类：</label>
					<div class="layui-input-inline">
						<select name="goods_shop_category_ids" lay-filter="goods_shop_category_ids">
							<option value="0" data-level="0">顶级分类</option>
							{foreach name="$goods_shop_category_list" item="vo"}
							<option value="{$vo['category_id']}" data-level="{$vo['level']}">{$vo['category_name']}</option>
							{notempty name="$vo['child_list']"}
							{foreach name="$vo['child_list']" item="vo_child"}
							<option value="{$vo_child['category_id']}" data-level="{$vo_child['level']}">&nbsp;&nbsp;&nbsp;&nbsp;{$vo_child['category_name']}</option>
							{/foreach}
							{/notempty}
							{/foreach}
						</select>
					</div>
				</div>
			</div>
			<div class="layui-form-item">
				<div class="layui-inline">
					<label class="layui-form-label">销量：</label>
					<div class="layui-input-inline">
						<input type="number" name="start_sale" id="start_sale" lay-verify="int" placeholder="最低销量" class="layui-input" autocomplete="off">
					</div>
					<div class="layui-form-mid">-</div>
					<div class="layui-input-inline">
						<input type="number" name="end_sale" id="end_sale" lay-verify="int" placeholder="最高销量" class="layui-input" autocomplete="off">
					</div>
				</div>
			</div>

            <div class="layui-form-item">
                <div class="layui-inline">
                    <label class="layui-form-label">是否参与：</label>
                    <div class="layui-input-inline">
                        <select name="is_fenxiao" lay-filter="is_fenxiao">
                            <option value="">全部</option>
                            <option value="1">已参与</option>
                            <option value="0">未参与</option>
                        </select>
                    </div>
                </div>
            </div>

			<div class="ns-form-row">
				<button class="layui-btn ns-bg-color" lay-submit lay-filter="search">筛选</button>
				<button type="reset" class="layui-btn layui-btn-primary">重置</button>
			</div>
		</form>
	</div>
</div>

<table id="goods_list" lay-filter="goods_list"></table>

<!-- 商品信息 -->
<script type="text/html" id="goods_info">
	<div class="ns-table-title">
		<div class="ns-title-pic">
			<img layer-src src="{{ns.img(d.goods_image.split(',')[0], 'small')}}"/>
		</div>
		<div class="ns-title-content">
			<a href="javascript:;" class="ns-multi-line-hiding ns-gn-color" title="{{d.goods_name}}">{{d.goods_name}}</a>
		</div>
	</div>
</script>

<!-- 操作 -->
<script type="text/html" id="action">
	<div class="operation-wrap" data-goods-id="{{d.goods_id}}">
		<div class="popup-qrcode-wrap"><img class="popup-qrcode-loadimg" src="__STATIC__/loading/loading.gif" /></div>
		<div class="ns-table-btn">
			{{# if(d.is_fenxiao == 1){ }}
			<a class="layui-btn" lay-event="config">佣金设置</a>
			<a class="layui-btn" lay-event="modify">取消分销</a>
			{{# }else{ }}
			<a class="layui-btn" lay-event="modify">参与分销</a>
			{{# } }}
		</div>
	</div>
</script>

<!-- 批量操作 -->
<script type="text/html" id="batchOperation">
	<button class="layui-btn layui-btn-primary" lay-event="join">参与分销</button>
	<button class="layui-btn layui-btn-primary" lay-event="cancel">取消分销</button>
</script>

<script type="text/html" id="toolbarOperation">
	<button class="layui-btn layui-btn-primary" lay-event="join">参与分销</button>
	<button class="layui-btn layui-btn-primary" lay-event="cancel">取消分销</button>
</script>

{/block}

{block name="script"}
<script>
	var form, element, repeat_flag, table;
	$(function () {
		layui.use(['form', 'element'], function () {
			form = layui.form;
			repeat_flag = false; //防重复标识
			element = layui.element;

			refreshTable();
			form.render();

			// 监听工具栏操作
			table.tool(function (obj) {
				var data = obj.data;
				switch (obj.event) {
					case 'config':
						//编辑
						location.href = ns.url("fenxiao://shop/fenxiao/config", {"goods_id": data.goods_id});
						break;
					case 'modify':
						//删除
						modifyFenxiao(data.goods_id, data.is_fenxiao);
						break;
				}
			});

			// 搜索功能
			form.on('submit(search)', function (data) {
				table.reload({
					page: {
						curr: 1
					},
					where: data.field
				});
				return false;
			});
		});
	});

	// 刷新表格列表
	function refreshTable() {
		var cols = [
			[{
                type: 'checkbox',
                unresize: 'false',
                width: '3%'
            },{
				title: '商品名称',
				unresize: 'false',
				width: '25%',
				templet: '#goods_info'
			}, {
				field: 'price',
				title: '<span style="padding-right: 15px;">价格(元)</span>',
				unresize: 'false',
				width: '10%',
				align: 'right',
				templet: function (data) {
					return '<span style="padding-right: 15px;">￥' + data.price + '</span>';
				}
			}, {
				field: 'goods_stock',
				title: '库存',
				unresize: 'false',
				width: '8%'
			}, {
				field: 'sale_num',
				title: '销量',
				unresize: 'false',
				width: '10%'
			}, {
				title: '销售状态',
				unresize: 'false',
				width: '10%',
				templet: function (data) {
					var str = '';
					if (data.goods_state == 1) {
						str = '<span style="color: green">销售中</span>';
					} else if (data.goods_state == 0) {
						str = '<span style="color: red">仓库中</span>';
					}
					return str;
				}
			}, {
				title: '是否参与',
				unresize: 'false',
				width: '10%',
				templet: function (data) {
					var  str = '';
					if (data.is_fenxiao == 0) {
						str = '未参与';
					} else if (data.is_fenxiao == 1) {
						str = '已参与';
					}
					return str;
				}
			}, {
				title: '<div class="ns-prompt-block">' + '规则' +
							'<div class="ns-prompt">' +
								'<i class="iconfont iconwenhao1"></i>'+
								'<div class="ns-prompt-box" >' +
									'<div class="ns-prompt-con">' +
										'<ul style="font-weight: 100">'+
											'<li>1、分销商层级与后台配置有关，最多三级分销。</li>'+
											'<li>2、分销商等级与分销商的分销订单数，分销订单总额，自购订单数，自购订单总额，分销商下线人数，分销商的下级分销商人数有关。</li>'+
											'<li>3、商品分销总佣金不得超过商品实际价格的50%。</li>'+
											'<li>4、分销佣金是根据当前分销订单所属分销商等级或者商品自定义的计算规则进行结算。</li>'+
											'<li>5、分销结算说明： A 、B 、C是分销商，C的上级为B，B的上级为A。' +
						'分佣按照所属分销商的等级佣金比率进行分配，分销商C的等级分佣比率为一级10%，二级5%，三级2%，' +
						'订单属于分销商C，则C获得商品实付金额10%，B获得商品实付金额5%，A获得商品实付金额2%。' +
						'若C推荐的普通用户D购买商品，则该订单属于C；若C购买商品，则该订单属于C。</li>'+
										'</ul>'+
									'</div>' +
								'</div>' +
							'</div>' +
						'</div>',
				unresize: 'false',
				width: '10%',
				templet: function (data) {
					var  str = '';
					if (data.fenxiao_type == 1) {
						str = '默认规则';
					} else if (data.fenxiao_type == 2) {
						str = '单独设置';
					}
					return str;
				}
			}, {
				title: '操作',
				toolbar: '#action',
				unresize: 'false',
				width: '15%'
			}]
		];

		table = new Table({
			elem: '#goods_list',
			url: ns.url("fenxiao://shop/fenxiao/lists"),
			cols: cols,
            bottomToolbar: "#batchOperation",
            toolbar: '#toolbarOperation',
			where: {
				search_text: $("input[name='search_text']").val(),
				start_sale: $("input[name='start_sale']").val(),
				end_sale: $("input[name='end_sale']").val(),
				category_id: $("input[name='category_id']").val(),
			}
		});

		// 批量操作
		table.toolbar(function (obj) {
			if (obj.data.length < 1) {
				layer.msg('请选择要操作的数据');
				return;
			}
			var id_array = new Array();
			for (i in obj.data) id_array.push(obj.data[i].goods_id);
			switch (obj.event) {
				case "join":
					joinFenxiao(id_array);
					break;
				case 'cancel':
					//下架
					cancelFenxiao(id_array);
					break;
			}
		});
        // 批量操作
        table.bottomToolbar(function (obj) {
            if (obj.data.length < 1) {
                layer.msg('请选择要操作的数据');
                return;
            }
            var id_array = new Array();
            for (i in obj.data) id_array.push(obj.data[i].goods_id);
            switch (obj.event) {
                case "join":
                    joinFenxiao(id_array);
                    break;
                case 'cancel':
                    //下架
                    cancelFenxiao(id_array);
                    break;
            }
        });
	}

	//配置参与状态
	function modifyFenxiao(goods_id, is_fenxiao) {
		layer.confirm('确定要进行更改吗?', function () {
			if (repeat_flag) return;
			repeat_flag = true;
			$.ajax({
				url: ns.url("fenxiao://shop/fenxiao/modify"),
				data: {goods_id: goods_id, is_fenxiao:is_fenxiao},
				dataType: 'JSON',
				type: 'POST',
				success: function (res) {
					layer.msg(res.message);
					repeat_flag = false;
					if (res.code == 0) {
						table.reload();
					}
				}
			});
		});
	}

	//参与分销
    function joinFenxiao(goods_ids){
        layer.confirm('批量参与分销的商品，如果之前未配置佣金规则，则使用默认规则，是否继续？', {title: '提示'}, function () {
            if (repeat_flag) return;
            repeat_flag = true;

            $.ajax({
                url: ns.url("fenxiao://shop/fenxiao/setGoodsIsFenxiao"),
                data: {goods_ids: goods_ids.toString(), is_fenxiao: 1},
                dataType: 'JSON',
                type: 'POST',
                success: function (res) {
                    layer.msg(res.message);
                    repeat_flag = false;
                    if (res.code == 0) {
                        table.reload();
                    }
                }
            });
        });
    }

    //取消分销
    function cancelFenxiao(goods_ids) {
        layer.confirm('是否设置商品不参与分销?', {title: '提示'}, function () {
            if (repeat_flag) return;
            repeat_flag = true;

            $.ajax({
                url: ns.url("fenxiao://shop/fenxiao/setGoodsIsFenxiao"),
                data: {goods_ids: goods_ids.toString()},
                dataType: 'JSON',
                type: 'POST',
                success: function (res) {
                    layer.msg(res.message);
                    repeat_flag = false;
                    if (res.code == 0) {
                        table.reload();
                    }
                }
            });
        });
    }
</script>
{/block}